import React from 'react';
import './xinzenghuodong.css'
import axios from 'axios'

class Xinzenghuodong extends React.Component{
    constructor(){
        super()
        this.state={
            nameValue:'',
            dateValue:'',
            beizhuValue:'',
            leibieValue:'',
            jieshuValue:'',
        }
    }
    nameChange(e){
        this.setState({
            nameValue:e.target.value
        })
    }
    dateChange(e){
        this.setState({
            dateValue:e.target.value
        })
    }
    beizhuChange(e){
        this.setState({
            beizhuValue:e.target.value
        })
    }
    leibieChange(e){
        this.setState({
            leibieValue:e.target.value
        })
    }
    jieshuChange(e){
        this.setState({
            jieshuValue:e.target.value
        })
    }
    tijiao(){
        axios({
            url:'http://123.57.67.148:3000/mock/60/addActive',
            methed:'get',
            data:{
                activeName:this.state.nameValue,
                activeStartDate:this.state.dateValue,
                activeBeizhu:this.state.beizhuValue,
                activeLeibie:this.state.leibieValue,
                activeEndDate:this.state.jieshuValue
            }
        }).then(res=>{
            console.log(res)
            alert(res.data.message)
        }).catch(err=>{
            console.log(err)
        })
    }
    render() {
        return(
            <div>
                <div className="clear">
                    <div className="float_left">
                        <div>
                            <label htmlFor="huodong">
                                <span className="text_content">活动名称：</span>
                            </label>
                            <input className="myinput" id="huodong" placeholder="请输入内容" onChange={this.nameChange.bind(this)} defaultValue={this.state.nameValue}/>
                        </div>
                        <div>
                            <span className="text_content">开启时间：</span>
                            <input className="myinput" type="date" placeholder="请输入时间" onChange={this.dateChange.bind(this)} defaultValue={this.state.dateValue}/>
                        </div>
                        <div>
                            <label htmlFor="mytext">
                                <span className="text_content">备注：</span>
                            </label>
                            <textarea placeholder="请输入内容" id="mytext" cols="20" rows="10" onChange={this.beizhuChange.bind(this)} defaultValue={this.state.beizhuValue}/>
                        </div>
                    </div>
                    <div className="float_left">
                        <div>
                            <label htmlFor="leibie">
                                <span className="text_content">类别：</span>
                            </label>
                            <input className="myinput" id="leibie" placeholder="请输入内容" onChange={this.leibieChange.bind(this)} defaultValue={this.state.beizhuValue}/>
                        </div>
                        <div>
                            <span className="text_content">结束时间：</span>
                            <input className="myinput" type="date" placeholder="请输入时间" onChange={this.jieshuChange.bind(this)} defaultValue={this.state.jieshuValue}/>
                        </div>
                    </div>

                </div>
                <div className="tijiao" onClick={this.tijiao.bind(this)}>提交</div>
            </div>
        )
    }
}

export default Xinzenghuodong